{extend name="common@public/base" /}

{block name="body"}

{load href="/load/forum/static/css/forum.css" /}
<div class="forum-block">

    <div class="allWrap">
        <div class="layui-carousel" id="test1">
            <div carousel-item>
                <div><img src="/static/images/demo/1.jpg"></div>
                <div><img src="/static/images/demo/2.jpg"></div>
                <div><img src="/static/images/demo/3.jpg"></div>
                <div><img src="/static/images/demo/4.jpg"></div>
                <div><img src="/static/images/demo/5.jpg"></div>
                <div><img src="/static/images/demo/6.jpg"></div>
            </div>
        </div>
        <!-- 条目中可以是任意内容，如：<img src=""> -->
    </div>


    <div class="allWrap">
        <div class="listWrap">
            {volist name="list" id="l"}
            <div class="layui-card">
                <div class="layui-card-header">
                    <fieldset class="layui-elem-field layui-field-title"
                              style="margin-top: 20px;border-color: #c51064;">
                        <legend>{$l.title}</legend>
                    </fieldset>
                </div>
                <div class="layui-card-body">
                    <div class="layui-row layui-col-space10">
                        {volist name="blist[$l['id']]" id="bl"}
                        <div class="layui-col-xs12 layui-col-md6 forum-block-info">
                            <div class="layui-inline layui-col-md4">
                                <img class="layui-anim-fadein" src="{:thumb($bl.cover,150,150)}" style="width: 100px">
                            </div>
                            <div class="layui-inline layui-col-md8" style="line-height: 26px">
                                <h4><a href="{:url('forum/post/index',['bid'=>$bl['id']])}">{$bl.title}</a></h4>
                                <p>
                                    帖子数：{$bl.post_count}

                                </p>
                                <p>
                                    回复数：{$bl.reply_count}
                                </p>
                              <!--  <p>最后发帖：</p>-->
                                <p>版主：{$bl.owner|get_user_info='nickname'}</p>
                            </div>

                        </div>
                        {/volist}
                    </div>
                </div>
            </div>
            {/volist}
        </div>

        <div class="edges">
            <div class="layui-card">
                <div class="layui-card-header">
                    <fieldset class="layui-elem-field layui-field-title"
                              style="margin-top: 20px;border-color: #c51064;">
                        <legend>ssss</legend>
                    </fieldset>
                </div>
                <div class="layui-card-body">
                    卡片式面板面板通常用于非白色背景色的主体内<br>
                    从而映衬出边框投影
                </div>
            </div>


        </div>
    </div>
</div>
{/block}

{block name="js"}

<script>
    layui.use('carousel', function () {
        var carousel = layui.carousel;
        //建造实例
        carousel.render({
            elem: '#test1'
            , width: '100%' //设置容器宽度
            , arrow: 'always' //始终显示箭头
            //,anim: 'updown' //切换动画方式
        });
    });
</script>


<script>
    //注意：选项卡 依赖 element 模块，否则无法进行功能性操作
    layui.use('element', function () {
        var element = layui.element();
    });
</script>
{/block}